<script lang='ts' setup name='App'>
import { ref } from "vue";
import Menu from "@/components/Menu.vue";
import Department from "@/views/department/index.vue";

</script>

<template>

<!-- <el-container>
            <el-header class="header">Header</el-header>
            <el-container class="btom">
                  <el-aside width="200px" class="menu">
                        <Menu/>
                       
                  </el-aside>
                  <el-main class="content">

                              <Department/>

                  </el-main>
            </el-container>
    </el-container> 
-->

    
    
      <el-container>
            <el-header class="header">Header</el-header>
            <el-container class="btom">
                  <el-aside width="200px" class="menu">
                        <!--  -->
                        <!-- <router-link></router-link> -->
                        <!-- <span> <RouterLink to="/html" active-class="active" >HTML知识点1</RouterLink></span>
                        <span>  <RouterLink to="/css" active-class="active">css知识点1</RouterLink></span>
                        <span>  <RouterLink to="/js" active-class="active">JavaScript1</RouterLink></span> -->



                        <span> <RouterLink :to="{path:'/html'}" active-class="active" >HTML知识点2</RouterLink></span>
                        <!-- <span> <RouterLink :to="{path:'/css'}" active-class="active" >css知识点2</RouterLink></span> -->
                        <span> <RouterLink :to="{name:'CSS'}" active-class="active" >css知识点2</RouterLink></span>
                        <span> <RouterLink :to="{path:'/js'}" active-class="active" >JavaScript2</RouterLink></span>
                       
                  </el-aside>
                  <el-main class="content">

                            <router-view></router-view>
                  </el-main>
            </el-container>
    </el-container>


</template>

<style scoped>
.header{
      background-color: #C6E2FF;
      line-height: 60px;
}

.btom{
      height: calc( 100vh - 60px );
}

.menu{
      background-color: skyblue; 
}

.menu>span{
   display: block;
   margin: 10px;
}
    
</style>